<template>
	<div class="web-container" :class="{ 'not-home': !isHomePage }">
		<header>
			<webBar :bgColor="bgColor" :menuList="menuList" />
		</header>
		<section class="web-main">
			<NuxtPage />
		</section>
		<footer>
			<footerContent :socialMediaList="socialMediaList" />
		</footer>
	</div>
</template>

<script setup>
import { GetWebSiteList, GetSocialMediaList } from '~/apis/web';
import { appStore } from '~/composables/store/modules/app';
import { userStore } from '~/composables/store/modules/user';
definePageMeta({
	layout: false,
	ssr: true, // 必须为 true
});

const menuList = ref([]);
const route = useRoute();
const bgColor = ref('transparent');
const isHomePage = ref(false);
const socialMediaList = ref([]);
const store = userStore();
const aStore = appStore();

const init = async () => {
	const res = await GetWebSiteList();
	if (res.code == 0) {
		menuList.value = res.data || [];
	}
};

const getLogo = () => {
	aStore.updateSiteInfo(store.tenantId);
	GetSocialMediaList().then(res => {
		if (res.code == 0) {
			socialMediaList.value = res.data;
		}
	});
};

init();
getLogo();

const domain = ref('');

// 监听路由变化
watch(
	() => route.path,
	newPath => {
		handleIsHome();
		// 重新设置滚动监听器
		updateScrollListener();
	}
);
// 添加滚动监听
onMounted(() => {
	handleIsHome(); // 确保先执行
	updateScrollListener();
	// window.location.host 包含域名和端口
	// window.location.hostname 只包含域名
	// domain.value = window.location.hostname
});

onUnmounted(() => {
	window.removeEventListener('scroll', handleScroll);
});

// 新增：更新滚动监听器的函数
const updateScrollListener = () => {
	// 先移除旧的监听器
	window.removeEventListener('scroll', handleScroll);
	// 如果是首页，添加新的监听器
	if (isHomePage.value) {
		window.addEventListener('scroll', handleScroll);
		// 立即执行一次，确保初始状态正确
		handleScroll();
	}
};

const handleScroll = () => {
	// 添加安全检查
	if (typeof window === 'undefined') return;
	if (!isHomePage.value) return;
	const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
	const opacity = Math.min(scrollTop / 200, 0.8); // 200px滚动距离达到最大透明度0.8
	bgColor.value = `rgba(4, 1, 2, ${opacity})`;
};

// 修改handleIsHome函数
const handleIsHome = () => {
	isHomePage.value =
		route.path == '/web' || route.path == '/zh-CN/web' || route.path == '/en-US/web';
	if (!isHomePage.value) {
		bgColor.value = '#000000';
	} else {
		bgColor.value = 'transparent';
		// 重置滚动位置时，确保背景色为透明
		if (typeof window !== 'undefined') {
			window.scrollTo(0, 0);
		}
	}
};

// 确保在组件初始化时执行
handleIsHome();
</script>

<style scoped>
.web-main {
	min-height: calc(100vh - 582px);
	background-color: transparent;
	/* 移除固定背景色 */
}

.not-home {
	padding-top: 140px;
	box-sizing: border-box;
}
</style>
